<!DOCTYPE html>
<html class="um landscape min-width-240px min-width-320px min-width-480px min-width-768px min-width-1024px">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <meta name="description" content="" />
        <meta name="keywords" content="" />
        <meta name="author" content="Flying hormone" />
        <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
        <meta name="renderer" content="webkit">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta charset="UTF-8">
        <link rel="stylesheet" href="../css/media.css" />
        <link rel="stylesheet" href="../css/mui.min.css" />
        <link rel="stylesheet" href="../css/head_foot.css" />
        <script type="text/javascript" src="../js/jquery-1.9.1.js"></script>
        <script type="text/javascript" src="../js/jquery.Query.js" ></script>
        <script type="text/javascript" src="../js/jquery-cookie.js"></script>
        <script type="text/javascript" src="../js/mui.min.js"></script>
        <script type="text/javascript" src="../js/appcan.js"></script>
        <script type="text/javascript" src="../js/appcan.control.js"></script>
        <script type="text/javascript" src="../js/common.js" ></script>
		<title>我的消息</title>
		<style>
           
            .quyu{ position: relative;}
            .quyu select{ background: none; margin-bottom: 0; }
            .xiangxia{ position: absolute; top: 0.625em; right: 0.625em; z-index: -100; }
            .tu_2 img{
                width: 100%;
                padding: 0.625em 1em;
                background: #fff;
            }
            .mui-table-view-cell>a:not(.mui-btn){ width: 70%; float: left; padding:0; margin: 0;}
            
            .mui-table-view-cell>p{  line-height:1.5em;}
            .mui-icon{ font-size: 1em;}
            .mui-table-view .mui-media-object.mui-pull-left{ border-radius: 50%;    line-height: 42px;
    max-width: 2.3em;
    height: 2.3em;
    margin-right: 1em}
    .mui-table-view .mui-media, .mui-table-view .mui-media-body{ 
        line-height: 1.5em;
        font-size: 0.9em;
    }
            .moban_btn{ position: absolute; top: 0; right: 0;}
            .moban_btn a{ color: #ddd; display: inline-block; width: 4em; text-align: center; border: 1px solid #ddd; border-radius: 0.3125em; margin-right: 0.3125em; margin-top: 0.625em;}
            .tishi_btn{ border-radius: 50%;
    background: #f34628;
    color: #fff;
    position: absolute;
    left: 3.5em;
    top: 0.8em;
    width: 1.4em;
    height: 1.4em;
    text-align: center;
    line-height: 1.4em;
    font-size: 0.7em;
    }
        </style>
	</head>

	<body>
		<header>
			<a><span class="leftleft"></span></a>
			<h1>我的消息</h1>
		</header>
		<section>
			<ul class="mui-table-view">
				<li class="mui-table-view-cell mui-media msgType1">
					<a href="javascript:;" onclick="openUrl('xiaoxiliebiao.html?msgType=1','xiaoxiliebiao')">
						<img class="mui-media-object mui-pull-left" src="../img/xiaoxi1.png">
						<div class="mui-media-body">
							活动消息 
							<p class="mui-ellipsis getMsg1">无活动消息</p>
						</div>
					</a>
				</li>
				<li class="mui-table-view-cell mui-media msgType2">
					<a href="javascript:;" onclick="openUrl('tuisongliebiao.html','tuisongliebiao')">
						<img class="mui-media-object mui-pull-left" src="../img/xiaoxi2.png">
						<div class="mui-media-body">
							推送消息
							<p class="mui-ellipsis getMsg2">无推送消息</p>
						</div>
					</a>
				</li>
				<li class="mui-table-view-cell mui-media msgType0">
					<a href="javascript:;" onclick="openUrl('xiaoxiliebiao.html?msgType=0','xiaoxiliebiao')">
						<img class="mui-media-object mui-pull-left" src="../img/xiaoxi3.png">
						<div class="mui-media-body">
							系统消息
							<p class="mui-ellipsis getMsg0">无系统消息</p>
						</div>
					</a>
				</li>
			</ul>
		</section>

		<footer>
			<nav class="mui-bar mui-bar-tab">
				<a href="javascript:;" id="tcIndex">
                    <img src="../img/shouye2.png" />
                    <span class="mui-tab-label">首页</span>
                </a>
                <a href="javascript:;" id="myfabu">
                    <img src="../img/fabu2.png" />
                    <span class="mui-tab-label">发布</span>
                </a>
                <a class="action" href="javascript:;" id="myInfo">
                    <img src="../img/mine2.png" />
                    <span class="mui-tab-label">我的</span>
                </a>
			</nav>
		</footer>
        <script>
            $(function(){
               totalCount(0);
               totalCount(1);
               totalCount(2);
               getMsg(0);
               getMsg(1);
               getMsg(2);
            })
            function totalCount(msgType){
                appcan.ajax({
                    type:"post",
                    async:false,       
                    url:host+"/getMsgCount.json?userId="+appcan.locStorage.getVal("userId")+"&msgType="+msgType+"&state=1",
                    data:"",
                    dataType:"json",
                    contentType: "application/json",
                    success : function(dataResult) {
                        $(".msgType"+msgType).append('<span class="tishi_btn">'+dataResult.data+'</span>');
                    }
                })
            }
            function getMsg(msgType){
                appcan.ajax({
                    type:"post",
                    url:host+"/getUserMsgList.json?userId="+appcan.locStorage.getVal("userId")+"&msgType="+msgType+"&state=1",
                    dataType:"json",
                    contentType: "application/json",
                    success : function(dataResult){
                        if(dataResult.data.length>0){
                            $(".getMsg"+msgType).html(dataResult.data[0].content);
                        }
                    }
                })
            }
        </script>
	</body>

</html>